﻿{extend name="home_layout" /}
{block name="style"}
<!-- 本页样式表 -->
<link href="__CSS__/prettify.css" rel="stylesheet" />
<link href="__CSS__/detail.css" rel="stylesheet" />
{/block}
{block name="body"}
<!-- 主体（一般只改变这里的内容） -->
<div class="blog-body">
    <div class="blog-container">
        <blockquote class="layui-elem-quote sitemap layui-breadcrumb shadow">
            <a href="{:url('/')}" title="网站首页">网站首页</a>
            <a><cite>基于layui的laypage扩展模块！</cite></a>
        </blockquote>
        <div class="blog-main">
            <div class="blog-main-left">
                <!-- 文章内容（使用Kingeditor富文本编辑器发表的） -->
                <div class="article-detail shadow">
                    <div class="article-detail-title">
                        {$article->title}
                    </div>
                    <div class="article-detail-info">
                        <span>编辑时间：{$article->create_time}</span>
                        <span>作者：{$article->author}</span>
                        <span>浏览量：{$article->brow_volume}</span>
                    </div>
                    <div class="article-detail-content">
                        {:html_entity_decode($article->content)}
                    </div>
                </div>
                <!-- 评论区域 -->
                <div class="blog-module shadow" style="box-shadow: 0 1px 8px #a6a6a6;">
                    <fieldset class="layui-elem-field layui-field-title" style="margin-bottom:0">
                        <legend>来说两句吧</legend>
                        <div class="layui-field-box">
                            <form class="layui-form blog-editor" action="">
                                <div class="layui-form-item">
                                    <textarea name="editorContent" lay-verify="content" id="remarkEditor" placeholder="请输入内容" class="layui-textarea layui-hide"></textarea>
                                </div>
                                <div class="layui-form-item">
                                    <button class="layui-btn" lay-submit="formRemark" lay-filter="formRemark">提交评论</button>
                                </div>
                            </form>
                        </div>
                    </fieldset>
                    <div class="blog-module-title">最新评论</div>
                    <ul class="blog-comment">
                        <li>
                            <div class="comment-parent">
                                <img src="__IMG__/Absolutely.jpg" alt="absolutely" />
                                <div class="info">
                                    <span class="username">Absolutely</span>
                                    <span class="time">2017-03-18 18:46:06</span>
                                </div>
                                <div class="content">
                                    我为大家做了模拟评论功能！还有，这个评论功能也可以改成和留言一样，但是目前没改，有兴趣可以自己改
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="blog-main-right">
                <!--右边悬浮 平板或手机设备显示-->
                <div class="category-toggle"><i class="fa fa-chevron-left"></i></div><!--这个div位置不能改，否则需要添加一个div来代替它或者修改样式表-->
                <div class="article-category shadow">
                    <div class="article-category-title">分类导航</div>
                    <!-- 点击分类后的页面和artile.html页面一样，只是数据是某一类别的 -->
                    {volist name="labels" id="label"}
                    <a href="{:url('/technology/'.$label->id)}">{$label->name}</a>
                    {/volist}
                    <div class="clear"></div>
                </div>
                <div class="blog-module shadow">
                    <div class="blog-module-title">置顶文章</div>
                    <ul class="fa-ul blog-module-ul">
                        {volist name="hots" id="hot"}
                        <li><i class="fa-li fa fa-hand-o-right"></i><a href="{:url('/article_'.$hot->id)}">{$hot->title}</a></li>
                        {/volist}
                    </ul>
                </div>
                <div class="blog-module shadow">
                    <div class="blog-module-title">随便看看</div>
                    <ul class="fa-ul blog-module-ul">
                        {volist name="randArts" id="art"}
                        <li><i class="fa-li fa fa-hand-o-right"></i><a href="{:url('/article_'.$art->id)}">{$art->title}</a></li>
                        {/volist}
                    </ul>
                </div>
            </div>
            <div class="clear"></div>
        </div>
    </div>
</div>
{/block}
{block name="script"}
<!-- 比较好用的代码着色插件 -->
<script src="__JS__/prettify.js"></script>
<!-- 本页脚本 -->
<script src="__JS__/detail.js"></script>
{/block}